<template>
    <div>
       <el-breadcrumb separator-class="el-icon-arrow-right">
  <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
  <el-breadcrumb-item>权限管理</el-breadcrumb-item>
  <el-breadcrumb-item>权限列表</el-breadcrumb-item>
</el-breadcrumb> <br>
<el-card>
      <el-table :data="tableData" border style="width: 100%">
           <el-table-column type="index"  label="#"> </el-table-column>
           <el-table-column  prop="authName"  label="权限名称" ></el-table-column>
           <el-table-column  prop="path"  label="路径" ></el-table-column>
           <el-table-column label="等级"> 
             <template slot-scope="scope"> 
              <el-tag :type="tagobj[scope.row.level]"> 
                 {{scope.row.level | rank}}  
              </el-tag>
             </template>
           </el-table-column>
  </el-table>
</el-card>
    </div>
</template>

<script>
import { getrightsApi } from "@/http/api";
export default {
  data() {
    return {
      tableData: [],
      tagobj: {
        "0": "primary",
        "1": "success",
        "2": "warning"
      }
    };
  },
  mounted() {
    this.getlist();
  },
  methods: {
    async getlist() {
      let res = await getrightsApi("list");
      console.log(res);
      this.tableData = res;
    }
  }
};
</script>

<style scoped >
</style>
